import { createSlice } from '@reduxjs/toolkit'
import { createAsyncThunk } from '@reduxjs/toolkit'
import {
  getBanners,
  getHotRecommend,
  getNemAlum,
  getRankingList,
  getArtistList
} from '../service/recommend'
import type { RootState } from '@/store'
import type { bannerType, hotType, newAlbumType, artistListType, playListDetailType, rankingListType } from './type'



// 轮播图
export const fetchBannerDataAction = createAsyncThunk(
  'banners',
  async (arg, { dispatch }) => {
    getBanners().then((res) => {
      dispatch(changeBannersAction(res.banners))
    })
  }
)

// 热门推荐
export const fetchHotRecommendAction = createAsyncThunk(
  'hotRecommend',
  async (arg, { dispatch }) => {
    getHotRecommend().then((res) => {
      console.log(res.result, '热门推荐')
      dispatch(changeHotRecommendAction(res.result))
    })
  }
)

// 新碟上架
export const fetchNewAlbumAction = createAsyncThunk(
  'newAlbum',
  async (arg, { dispatch }) => {
    getNemAlum().then((res) => {
      console.log(res.albums, '新碟上架')
      dispatch(changeNewAlbumAction(res.albums))
    })
  }
)

//入驻歌手列表
export const fetchArtistListAction = createAsyncThunk(
  'artistList',
  async (arg, { dispatch }) => {
    getArtistList(5001, 5).then((res) => {
      console.log('入驻歌手列表', res.artists)
      dispatch(changeArtistListAction(res.artists))
    })
  }
)

//榜单id参数
export const rankingMap = {
  upRanking: 19723756,
  newRanking: 3779629,
  originRanking: 2884035
}
//榜单列表
export const fetchRankingDataAction = createAsyncThunk<
  void,
  void,
  { state: RootState }
>('ranking', (arg, { dispatch }) => {
  // 所有的榜单数据
  const promises: Promise<any>[] = []
  let key: keyof typeof rankingMap
  for (key in rankingMap) {
    const id = rankingMap[key]
    promises.push(getRankingList(id))
  }

  Promise.all(promises).then((res) => {
    const rankings = res.map((item) => item.playlist)
    dispatch(changeRankingListAction(rankings))
    console.log(rankings)
  })
})

interface RecommendState {
  banners: bannerType[]
  hotRecommend: hotType[]
  newBlum: newAlbumType[]
  playListDetail: playListDetailType[]
  artistList: artistListType[]
  rankingList: rankingListType[]
}

const initialState: RecommendState = {
  banners: [],
  hotRecommend: [],
  newBlum: [],
  playListDetail: [],
  artistList: [],
  rankingList: []
}

const recommendSlice = createSlice({
  name: 'recommend',
  initialState,
  reducers: {
    changeBannersAction(state, { payload }) {
      state.banners = payload
    },
    changeHotRecommendAction(state, { payload }) {
      state.hotRecommend = payload
    },
    changeNewAlbumAction(state, { payload }) {
      state.newBlum = payload
    },
    changePlayListDetailAction(state, { payload }) {
      state.playListDetail = payload
    },
    changeArtistListAction(state, { payload }) {
      state.artistList = payload
    },
    changeRankingListAction(state, { payload }) {
      state.rankingList = payload
    }
  }
})
export const {
  changeBannersAction,
  changeHotRecommendAction,
  changeNewAlbumAction,
  changePlayListDetailAction,
  changeArtistListAction,
  changeRankingListAction
} = recommendSlice.actions

export default recommendSlice.reducer
